<template>
  <div>
    <el-tabs v-model="activeName"
             :lazy='true'
             @tab-click="page=1,init($event)">
      <el-tab-pane label="提现明细"
                   name="withdrawa">
        <el-table :data="detail.list"
                  v-loading='loading'
                  :summary-method='summary'
                  show-summary>
          <el-table-column label="提现金额"
                           align="center">
            <template slot-scope="scope">
              {{scope.row.money || 0}}元
            </template>
          </el-table-column>
          <el-table-column label="提现时间"
                           align="center"
                           prop="audit_time">
            <template slot-scope="scope">
              {{scope.row.audit_time | timestamp}}
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="收入明细"
                   name="income">
        <el-table :data="detail.list"
                  :summary-method='summary'
                  v-loading='loading'
                  show-summary>
          <el-table-column label="收入/活动名称"
                           align="center"
                           prop="cate_name"></el-table-column>
          <el-table-column label="金额"
                           align="center">
            <template slot-scope="scope">
              {{scope.row.card_reward || 0}}元
            </template>
          </el-table-column>
          <el-table-column label="收入时间"
                           align="center"
                           prop="sale_time"></el-table-column>
          <el-table-column label="收入类型"
                           align="center"
                           prop="type"></el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
    <v-Pagination v-if='detail && detail.rows'
                  :total='detail.rows'
                  :page.sync='page'
                  @pagination='init({index:index})' />
  </div>
</template>
<script>
export default {
  data () {
    return {
      activeName: 'withdrawa',  //默认展示提现明细
      detail: [],  //提现明细
      index: 0,
      page: 1, //当前页
      loading: false
    }
  },
  props: ['sid'],
  methods: {
    async init (e = { index: 0 }) {  //index 当前tab下标
      this.loading = true
      let { index } = e;
      this.index = index;  //存储当前所点击index
      let params = Object.assign({}, { sid: this.sid, page: this.page })  //sid 维修厂id  page 当前页
      const res = index == 0 ? await this.api.joinCashDetail(params) : await this.api.joinIncDetailed(params)  //根据index 请求不同的接口  joinCashDetail-提现明细  joinIncDetailed-收入明细
      this.loading = false
      this.detail = res.data || []
    },
    summary ({ columns }) { //总金额
      let sum = []
      columns.forEach((e, i) => {
        sum[i] = ''
      });
      sum[columns.length - 1] = `合计:${this.detail.total || 0}元`
      return sum;
    }
  },
  mounted () {
    this.init()
  }
}
</script>

<style>
</style>
